@import "~assets/styles/_bootstrap";

.class-list-page {
	width: 100%;
	height: 100%;

	.goods-list {
		position: relative;
		padding: rem(10px);

		.item {

			.nav {
		    margin-top: rem(10px);
		    padding-left: rem(10px);
		    height: rem(24px);
		    line-height: rem(24px);
		    border-bottom: 1px solid #eee;
		    background: #eee;

		    > h3 {
		    	display: inline-block;
					font-size: rem(15px);
			    color: #666;
		    }

		    .more {
		    	position: absolute;
		    	right: 0;
		    	padding-right: rem(20px);
		    	height: rem(24);

		    	&:before {
		    		position: absolute;
		    		display: inline-block;
		    		top: 0;
		    		bottom: 0;
		    		right: 0;
		    		margin: auto 0;
		    		width: rem(22px);
		    		height: rem(22px);
		    		content: ' ';
		    		background: url('~assets/images/svg/icon-right.svg') no-repeat;
		    		background-size: 100%;
		    	}
		    }
			}

			> ul {
				padding-top: rem(10px);

				&:after {
					display: block;
					clear: both;
					content: ' ';
				}

				.item {
					float: left;
					padding: rem(5px) 0;
					width: rem(90px);
					height: rem(95px);

					> a {
						display: block;
						font-size: rem(12px);
						text-align: center;
				    overflow: hidden;
				    text-overflow: ellipsis;
				    display: -webkit-box;
				    -webkit-box-orient: vertical;
				    -webkit-line-clamp: 2;

						> img {
							margin: auto;
							width: rem(55px);
							height: rem(55px);
						}

						> span {
							display: block;
							padding-top: rem(5px);
						}
					}

				}
			}
		}
	}
}